/****************************************
	CSS 3 SEARCH FORM BY CAMERON BANEY
    Design Blog: http://blog.cameronbaney.com 
	Twitter: @cameronbaney
****************************************/

#shorten_form {
    background: #e1e1e1; /* Fallback color for non-css3 browsers */
    width: 650px;
    margin: -5px 50px -5px 0px;

    /* Gradients */
    background: -webkit-gradient( linear,left top, left bottom, color-stop(0, rgb(243,243,243)), color-stop(1, rgb(225,225,225)));
    background: -moz-linear-gradient( center top, rgb(243,243,243) 0%, rgb(225,225,225) 100%);

    /* Rounded Corners
    border-radius: 17px;
    -webkit-border-radius: 17px;
    -moz-border-radius: 17px;*/

    /* Shadows */
    box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
    -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
    -moz-box-shadow: 1px 1px 2px rgba(0,0,0,.3), 0 0 2px rgba(0,0,0,.3);
}
div#copyDiv{
    border: 0;
    color: #eee;
    cursor: pointer;
    float: right;
    font: 16px Arial, Helvetica, sans-serif;
    font-weight: bold;
    height: 30px;
    text-shadow: 0 -1px 0 rgba(0,0,0,.3);
    width: 84px;
    outline: none;

    /* Rounded Corners */
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;

    /* Shadows */

}
.search div#outLink{
    background: #fafafa; /* Fallback color for non-css3 browsers */

    /* Gradients */
    background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(250,250,250)), color-stop(1, rgb(230,230,230)));
    background: -moz-linear-gradient( center top, rgb(250,250,250) 0%, rgb(230,230,230) 100%);

    border: 0;
    border-bottom: 1px solid #fff;
    border-right: 1px solid rgba(255,255,255,.8);
    font-size: 16px;
    margin: 4px;
    padding: 5px;
    width: 435px;

    /* Rounded Corners */
    border-radius: 17px;
    -webkit-border-radius: 17px;
    -moz-border-radius: 17px;

    /* Shadows */
    box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
    -webkit-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
    -moz-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
}

/*** TEXT BOX ***/
#search input[type="text"]{
    background: #fafafa; /* Fallback color for non-css3 browsers */

    /* Gradients */
    background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(250,250,250)), color-stop(1, rgb(230,230,230)));
    background: -moz-linear-gradient( center top, rgb(250,250,250) 0%, rgb(230,230,230) 100%);

    border: 0;
    border-bottom: 1px solid #fff;
    border-right: 1px solid rgba(255,255,255,.8);
    font-size: 25px;
    margin: 4px;
    padding: 5px;
    width: 535px;

    /* Rounded Corners */
    /*border-radius: 17px;
    -webkit-border-radius: 17px;
    -moz-border-radius: 17px;*/

    /* Shadows */
    box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
    -webkit-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
    -moz-box-shadow: -1px -1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2);
}

/*** USER IS FOCUSED ON TEXT BOX ***/
#search input[type="text"]:focus{
    outline: none;
    background: #fff; /* Fallback color for non-css3 browsers */

    /* Gradients */
    background: -webkit-gradient( linear, left bottom, left top, color-stop(0, rgb(255,255,255)), color-stop(1, rgb(235,235,235)));
    background: -moz-linear-gradient( center top, rgb(255,255,255) 0%, rgb(235,235,235) 100%);
}

/*** SEARCH BUTTON ***/
.search input[type="submit"],input[type="button"]{
    color: #d7d7d7;
    border: solid 1px #333;
    background: #333;
    background: -webkit-gradient(linear, left top, left bottom, from(#666), to(#000));
    background: -moz-linear-gradient(top,  #666,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#666666', endColorstr='#000000');
    /*-webkit-border-radius: 2em;
    -moz-border-radius: 2em;
    border-radius: 2em;*/
    margin: 10px 4px 4px 4px;
    font: 20px/100% Arial, Helvetica, sans-serif;
    font-weight: bold;
    padding: 5px;

}
.search input[type="submit"]:hover,input[type="button"]:hover {
    background: #000;
    background: -webkit-gradient(linear, left top, left bottom, from(#444), to(#000));
    background: -moz-linear-gradient(top,  #444,  #000);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#000000');
}
.search input[type="submit"]:active,input[type="button"]:active  {
    color: #666;
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#444));
    background: -moz-linear-gradient(top,  #000,  #444);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#666666');
}